โค้ดนี้ถูกถามถึงกันมากครับ ซึ่งตัวอย่างการใช้งานที่ถามกันบ่อยๆ คือ การตรวจสอบว่ามีชื่อนี้ลงทะเบียนไว้แล้วหรือไม่ ในขณะกรอก ซึ่ง GAJAX ได้ช่วยให้การทำงานนี้ง่ายขึ้นมากครับ

นอกจากนี้ตัวอย่างนี้ยังแสดงให้เห็นถึงเทคนิคการใช้ซ้ำโค้ดอีกด้วย ด้วยการทำหน้าที่ ตรวจสอบข้อมูลใน input 2 ตัวพร้อมกันด้วยโค้ดชุดเดียว

<form id="check_form" method="post" action="chkarray.php">
<p><input type="text" id="user" /><span id="check_user">&nbsp;</span></p>
<p>ลองพิมพ์ <b>admin</b> ลงใน input</p>
<p><input type="text" id="email" /><span id="check_email">&nbsp;</span></p>
<p>ลองพิมพ์ <b>admin@goragod.com</b> ลงใน input</p>
</form>

โค้ดฟอร์ม ไม่มีอะไรครับแค่ส่วนหนึ่งของฟอร์มธรรมดา การกำหนด id ของ element ต่างๆมีความสัมพันธ์กับการตรวจสอบค่าครับ เช่น ฟิลด์ user ใช้กับ input ที่มี id เป็น user และ แสดงผลลัพท์ ที่ check_user และ ค่าที่ถูกส่งไปตรวจสอบ สามารถอ่านได้จาก $_POST[user] ในทำนองเดียวกันกับ email ครับ

ในโค้ดผมไม่ได้กำหนด name ให้กับ input ต่างๆ เนื่องจากว่ามันไม่ได้มีส่วนเกี่ยวพันใดๆ กับตัวอย่าง ซึ่งสามารถกำหนดเป็นอะไรก็ได้ และจะถูกใช้เมื่อ submit เท่านั้น

<script type="text/javascript">
// ตรวจจับการกรอกข้อความใน input
new $G('user').addEvent('keyup', doCheckUser);
</script>

โค้ด Javascript ของ input สำหรับกำหนด event ให้กับ input โดยจะไปเรียก doCheckUser เมื่อมีการกดคีย์บอร์ด

<script type="text/javascript">
var doCheckUser = function(event){
    // input ที่กำลังพิมพ์
    var input = GEvent.element(event);
    // พื้นที่แสดงข้อมูลตอบกลับ
    var result = $E('check_' + input.id);
    var req = new GAjax();
    // แสดงรูปรอโหลด เพื่อบอกว่ากำลังส่งข้อมูลไปตรวจสอบ
    result.innerHTML = '<img src="https://www.goragod.com/skin/img/wait.gif" alt="" />';
    // ajax ส่งข้อมูลไปตรวจสอบ
    req.send('getuserexists.php' ,  input.id + '=' + encodeURIComponent(input.value) , function(xhr) {
        result.innerHTML = xhr.responseText;
    });
};
</script>

โค้ด Javascript ส่วนนี้ สามารถแยกใส่ไว้ในไฟล์ JS ภายนอกได้ครับ ทำหน้าที่ส่งข้อมูลไปตรวจสอบ และ รับกลับมาแสดงผล

<?php
    if(isset($_POST[user])){
        if($_POST[user] == 'admin'){
            echo 'มีชื่อนี้อยู่แล้ว';
        }else{
            echo 'ใช้งานชื่อนี้ได้';
        }
    }
    if(isset($_POST[email])){
        if($_POST[email] == 'admin@goragod.com'){
            echo 'มีอีเมล์นี้อยู่แล้ว';
        }else{
            echo 'ใช้งานอีเมล์นี้ได้';
        }
    }

?>

โค้ด getuserexists.php ทำหน้าที่ตรวจสอบข้อมูลที่ส่งมา โดยคัดแยกการตรวจสอบจากค่าที่ส่งมา ซึ่งในการตรวจสอบ อาจเขียนโค้ดเพื่อตรวจสอบกับฐานข้อมูลก็ได้ครับ ตามความต้องการของเรา

ตัวอย่าง